<template>
	<view class="uni-global-box" >
		<view class="uni-global-title">
			系统设置 / 分类管理 / 新增分类
		</view>
		<view class="body">
			<u-form :model="form" ref="form1" class="u-form" label-width="0" >
				<view class="u-form-textInput">
					<view class="u-form-name">
						分类标题
					</view>
					<u-form-item prop="title" :border-bottom="false">
						<u-input class="u-form-input" v-model="form.title" 
							style="margin:0"
							placeholder="请输入标题"
						/>
					</u-form-item>
				</view>
				<view class="u-form-textInput">
					<view class="u-form-name">
						排序
					</view>
					<u-form-item prop="sort" :border-bottom="false">
						<u-input class="u-form-input" v-model="form.sort" 
							style="margin:0"
							placeholder="请输入排序"
						/>
					</u-form-item>
				</view>
				<view class="u-form-textInput">
					<view class="u-form-name">
						上传图标
					</view>
					<u-form-item prop="icon" :border-bottom="false">
						<uni-file-picker 
							v-model="image" file-mediatype="image"
							:image-styles="{width:'155'}"
							limit="1"
							@success="successImage"
						>
							<view class="u-form-image">
								<text class="iconfont icon-shangchuanyunduan"></text>
							</view>
						</uni-file-picker>
						
					</u-form-item>
				</view>
				<view class="u-form-textInput">
					<view class="u-form-name">
						首页展示
					</view>
					<u-form-item label="" prop="radio"  :border-bottom="false">
						<u-radio-group v-model="form.index_show">
							<u-radio v-for="(item, index) in radioList1" :key="index" :name="item.value"
								:disabled="item.disabled">
								{{ item.name }}
							</u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
				<view class="u-form-textInput">
					<view class="u-form-name">
						是否展示
					</view>
					<u-form-item label="" prop="radio"  :border-bottom="false">
						<u-radio-group v-model="form.is_show">
							<u-radio v-for="(item, index) in radioList1" :key="index" :name="item.value"
								:disabled="item.disabled">
								{{ item.name }}
							</u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
				<view class="u-form-textInput">
					<view class="u-form-name">
						分类类型
					</view>
					<u-form-item label="" prop="radio"  :border-bottom="false">
						<u-radio-group v-model="form.type">
							<u-radio v-for="(item, index) in radioList2" :key="index" :name="item.value"
								:disabled="item.disabled">
								{{ item.name }}
							</u-radio>
						</u-radio-group>
					</u-form-item>
				</view>
				<u-button @click="submit" type="primary" >提交</u-button>
			</u-form>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {rules,radioList1,radioList2  } from '/common/js_file/classify.js' ;
	export default {
		data() {
			let form = {
				"title": '',
				"icon": '',
				"number": 0,
				"item_number": 0,
				"index_show": 1,
				"is_show": 1,
				"sort": '',
				"type":'tech'
			}
			return {
				form,
				radioList1,
				radioList2,
				image:[],
				rules:rules,
			}
		},
		onLoad(val) {
			this.form.sort = parseInt(val.total) + 1; 
		},
		methods: {
			submit() {
				this.$refs.form1.validate(valid => {
					if (valid) {
						this.onInsert(this.form) ;
					} else {
						console.log('验证失败',this.form);
					}
				});
			},
			// 添加
			onInsert(form){
				uniCloud.importObject("classify").addData(form).then(result => {
					console.log()
					if(result.code == 200){
						this.$refs.uToast.show({
							title: '添加成功',
							type: 'primary',
							duration:500,
							position:'top',
							url: '/pages/system/class-manage/class-manage'
						})
					}else{
						this.$refs.uToast.show({
							title:result.message ,
							type: 'error',
							duration:1500,
							position:'top',
						})
					}
				})
			},
			// 图片上传成功
			successImage(val){
				this.form.icon = val.tempFilePaths[0] ;
			}
		},
		onReady() {
			this.$refs.form1.setRules(this.rules);
		}
	}
</script>

<style scoped >
	.body{
		padding:10px 30px;
		width: 50%;
	}
</style>
